"use client";

import { MessageSquareTextIcon } from "lucide-react";
import { useEditorRef } from "platejs/react";

import { commentPlugin } from "@/components/plate/plugins/comment-kit";

import { ToolbarButton } from "./toolbar";

export function CommentToolbarButton() {
  const editor = useEditorRef();

  return (
    &lt;ToolbarButton
      onClick={() =&gt; {
        editor.getTransforms(commentPlugin).comment.setDraft();
      }}
      data-plate-prevent-overlay
      tooltip="Comment"
    &gt;
      &lt;MessageSquareTextIcon /&gt;
    &lt;/ToolbarButton&gt;
  );
}
